:root {
  // 主字体大小
  --font-size: 12px;

  // 基础圆角
  --border-radius: 4px;

  //背景色
  --color-bg: #22272e; // 主背景色
  --color-bg-hover: hsla(0, 0%, 100%, 0.03);
  --color-bg-medium: #2d333b; // 浅一层的背景色额
  --color-bg-mask: rgba(28,33,40,0.8); // 浮层的背景蒙层颜色
  --color-bg-text-hover: rgba(255, 255, 255, 0.12); // 控制文本在悬停状态下的背景色

  //文字颜色
  --color-text: rgba(255, 255, 255, 0.85);
  --color-text-65: rgba(255, 255, 255, 0.65) // colorTextSecondary
  --color-text-45: rgba(255, 255, 255, 0.45); // colorTextTertiary
  --color-text-25: rgba(255, 255, 255,, 0.25); // colorTextQuaternary

  // 边框颜色
  --color-border: #575a6a; // 一级边框色
  --color-border-s: #474956; // 二级边框色

  // 填充色(暂时想不到哪里会用)
  --color-fill: rgba(0, 0, 0, 0.15);
  --color-fill-s: rgba(0, 0, 0, 0.06);
  --color-fill-t: rgba(0, 0, 0, 0.04);
  --color-fill-q: rgba(0, 0, 0, 0.02);

  // 阴影
  --box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08),
    0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
  --box-shadow-s: 0 6px 16px 0 rgba(0, 0, 0, 0.08),
    0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);

  // 成功警戒错误
  --color-success: #49aa19; // 成功色
  --color-success-bg: #162312; // 成功色背景色
  --color-warning: #d89614; // 警戒色
  --color-warning-bg: #2b2111; // 警戒色背景色
  --color-error: #dc4446; // 错误色
  --color-error-bg: #451d1f; // 错误色背景色
}
